<template>
    <el-dialog :modal=false :visible.sync="dialogVisible" v-dialogDrag
               :close-on-click-modal="false" title="结果输出路径" id="pathDialog">
        <el-tree style="padding-bottom:10px;overflow-y: auto;height: 200px"
                 ref="DirectoryTree"
                 highlight-current
                 :data="data"
                 lazy
                 :load="loadData"
                 accordion
                 :check-on-click-node="true"
                 @node-click="handleNodeClick">
        </el-tree>
        <el-button @click="confirm" type="primary" >确定</el-button>
        <el-button @click="dialogVisible=false" type="primary">取消</el-button>
    </el-dialog>
</template>
<script>

    export default {
        name: 'pathChooseDialog',
        // props: ['dialogVisible'],
        data() {
            return {
                data: [],
                currentNode: '',
                // isLoading: false,
                pathParam: "",
                dialogVisible:false
            };
        },
        methods: {
            handleNodeClick(data, node) {
                this.currentNode = node;
                // console.log(data);
                // console.log(node)
            },
            confirm(){
                let that = this;
                let node = this.currentNode;
                if (node === undefined || node.level === 0) {
                    this.pathParam = "/";
                } else {
                    for (let i = 0; i < this.currentNode.level; i++) {
                        this.pathParam = "/" + node.label + this.pathParam;
                        node = node.parent;
                    }
                }
                this.$emit('getPath',that.pathParam);
                that.pathParam="";
                that.dialogVisible=false;
            },
            loadData(node, resolve) {
                // this.isLoading=true;
                let that = this;
                let data = [];
                let currentNode = node;
                let path = "";
                if (node.data.type === "File") {
                    return resolve([]);
                }
                if (node.level === 0) {
                    path = "/";
                } else {
                    for (let i = 0; i < node.level; i++) {
                        path = "/" + currentNode.label + path;
                        currentNode = currentNode.parent;
                    }
                }
                // let url = "http://192.168.1.5:9000/dbfg/userSpace/all?path=";
                this.$axios.get(that.$URL.fileGetUrl + path)
                    .then(function (res) {
                        if (res.code === 200) {
                            // this.isLoading=false;
                            for (let item of res.body) {
                                if (item.Type !== "File") {
                                    let file = {};
                                    file.label = item.Name;
                                    file.type = item.Type;
                                    file.children = [""];
                                    data.push(file);
                                }
                            }
                            return resolve(data);
                        } else {
                            // this.isLoading=false;
                            return resolve([]);
                        }
                    });
            },

        },
        created() {
            let that = this;
            this.$Bus.$on("fileDialogVisible", res => {
                that.dialogVisible=res.fileDialogVisible;
            })
        }
    }
</script>

<style scoped>
    #pathDialog .el-dialog__body {
        padding: 20px 20px;
        color: #606266;
        font-size: 14px;
        word-break: break-all;
    }

    input[type=file] {
        display: none;
    }

    .el-tree > .el-tree-node {
        display: inline-block;
        min-width: 100%;
    }
</style>